import React, { FC } from 'react'
import { TableWrap, TabPlaceHolder, WrapBG } from './style'
import { Manager } from './manager'
import { MainTop } from './top'
import { Tab } from './tab'
import { OrganizeTree } from './organizeTree'
import { TableAll, TableOrg, TableOften, TableInteractive, TableDcs, TableLive } from './table'
import { useMccStore } from '../../store'
import shallow from 'zustand/shallow'
import { useParamsStore } from './store'

const QT_MEETING = 'qtmeeting' //量子会议
const AES_MEETING = 'aesmeeting' //AES加密会议
const GM_MEETING = 'gmeeting' //国密加密会议

const Main: FC = () => {
	const { isOrganize, currentTab, currentOrgId } = useParamsStore(
		(state) => ({
			isOrganize: state.tableSort === 3,
			currentTab: state.currentTab,
			currentOrgId: state.currentOrgId,
		}),
		shallow
	)
	const meetingEncryptionType = useMccStore((state) => {
		const mccInfo = state.mccInfo
		if (mccInfo.quantumEncryption === 1) {
			//量子
			return QT_MEETING
		} else if (mccInfo.encryptionType === 2) {
			return AES_MEETING
		} else if ((mccInfo.encryptionType === 3 || mccInfo.encryptionType === 4) && mccInfo.quantumEncryption === 0) {
			return GM_MEETING
		}
		return ''
	}, shallow)
	return (
		<>
			<WrapBG
				className={
					meetingEncryptionType === GM_MEETING
						? 'gm_meeting_bg'
						: meetingEncryptionType === AES_MEETING
						? 'aes_meeting_bg'
						: 'hidden'
				}
			/>
			<MainTop />
			<Manager />
			{isOrganize ? <TabPlaceHolder /> : <Tab />}
			{isOrganize ? (
				<TableWrap>
					<OrganizeTree />
					{currentOrgId !== 'often' &&
						currentOrgId !== 'interactive' &&
						currentOrgId !== 'live' &&
						currentOrgId !== 'dcs' && <TableOrg />}
					{currentOrgId === 'often' && <TableOften isOrganize={isOrganize} />}
					{currentOrgId === 'interactive' && <TableInteractive isOrganize={isOrganize} />}
					{currentOrgId === 'dcs' && <TableDcs isOrganize={isOrganize} />}
					{currentOrgId === 'live' && <TableLive isOrganize={isOrganize} />}
				</TableWrap>
			) : (
				<TableWrap>
					{currentTab === 'all' && <TableAll />}
					{currentTab === 'often' && <TableOften isOrganize={isOrganize} />}
					{currentTab === 'interactive' && <TableInteractive isOrganize={isOrganize} />}
					{currentTab === 'dcs' && <TableDcs isOrganize={isOrganize} />}
					{currentTab === 'live' && <TableLive isOrganize={isOrganize} />}
				</TableWrap>
			)}
		</>
	)
}
export default Main
